<html>
<head>
<meta name = "viewport" content = "width = device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">	
<script src="http://code.google.com/apis/gears/gears_init.js" type="text/javascript" charset="utf-8"></script>
<script src="js/geo.js" type="text/javascript" charset="utf-8"></script>
<script src="js/geo_position_js_simulator.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>

<script>

function initialize_map()
{
    var myOptions = {
	      zoom: 15,
	      mapTypeControl: true,
	      mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
	      navigationControl: true,
	      navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
	      mapTypeId: google.maps.MapTypeId.HYBRID      
	    }	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function initialize()
{
	if(!geo_position_js.init())
	{
		document.getElementById('current').innerHTML="Functionality not available";
	}
	
	setInterval(retrieve,1000);
}
function retrieve()
{
	document.getElementById('current').innerHTML="Receiving...";
	geo_position_js.getCurrentPosition(show_position,function(){document.getElementById('current').innerHTML="Couldn't get location"});
	
}
var last_position=null;
function show_position(p)
{
	if(last_position && last_position.coords.latitude==p.coords.latitude && last_position.coords.longitude==p.coords.longitude)
	{
		document.getElementById('current').innerHTML="User has not moved,checking again in 1s";
		return;
	}
	
	last_position=p;
	document.getElementById('current').innerHTML="latitude="+p.coords.latitude.toFixed(2)+" longitude="+p.coords.longitude.toFixed(2);
	var pos=new google.maps.LatLng(p.coords.latitude,p.coords.longitude);
	map.setCenter(pos);

	var infowindow = new google.maps.InfoWindow({
	    content: "<strong>yes</strong>"
	});

	var marker = new google.maps.Marker({
	    position: pos,
	    map: map,
	    title:"You are here"
	});

	google.maps.event.addListener(marker, 'click', function() {
	  infowindow.open(map,marker);
	});
	
}

	locations=new Array();
	locations.push({ coords:{latitude:41.399856290690956,longitude:2.1961069107055664},duration:5000 });
	locations.push({ coords:{latitude:41.400634242252046,longitude:2.1971797943115234},duration:5000 });
	locations.push({ coords:{latitude:41.40124586762545,longitude:2.197995185852051},duration:5000 });	
	
	locations.push({ coords:{latitude:41.401921867919995,longitude:2.1977806091308594},duration:2000 });	
	locations.push({ coords:{latitude:41.402533481174856,longitude:2.197566032409668},duration:5000 });	
	locations.push({ coords:{latitude:41.40308070920773,longitude:2.198038101196289},duration:7000 });	
	locations.push({ coords:{latitude:41.40317727838223,longitude:2.1985530853271484},duration:5000 });	

	locations.push({ coords:{latitude:41.40366012210204,longitude:2.1991539001464844},duration:8000 });	
	
	locations.push({ coords:{latitude:41.403402605897945,longitude:2.1996474266052246},duration:5000 });			
	locations.push({ coords:{latitude:41.40394982661179,longitude:2.200140953063965},duration:4000 });			
	locations.push({ coords:{latitude:41.40436828640125,longitude:2.2005486488342285},duration:6000 });			
	locations.push({ coords:{latitude:41.4050281598246,longitude:2.201235294342041},duration:7000 });			
	
	geo_position_js_simulator.init(locations);

</script >
<style>
	body {font-family: Helvetica;font-size:11pt;padding:0px;margin:0px}
	#title {background-color:#e22640;padding:5px;}
	#current {font-size:10pt;padding:5px;}	
</style>
</head>
<body onload="initialize_map();initialize()">
	<div id="title">Show Position In Map (Simulated)</div>
	<div id="current">Initializing...</div>
	<div id="map_canvas" style="width:320px; height:350px"></div>
</body>
</html>